/*
 * @Author: 若城
 * @LastEditors: 若城
 * @Description: 
 * @FilePath: \type-h5\src\components\invite-member\index.tsx
 * living Hell
 */
import { View } from "@tarojs/components";
import React, { useState } from "react";
import { AtFloatLayout } from "taro-ui";
import "./index.scss";
import inviteIcon from "../../assets/invite-icon.svg";
import classNames from "classnames";
import Taro, { getCurrentInstance } from "@tarojs/taro";
import { getStore } from "../../utils";

interface InviteMemberType {
  isOpened: boolean;
  setIsOpened: Function;
}

export const InviteMember = ({ isOpened, setIsOpened }: InviteMemberType) => {
  const { router } = getCurrentInstance();
  const [showToast, setShowToast] = useState(false);
  return (
    <View className="invite-member">
      {showToast && (
        <div className="copy-success">
          <span className="iconfont icon-Checkbox_unselect"></span>
          <span className="text">复制链接成功</span>
        </div>
      )}
      <AtFloatLayout
        className="invite-member-layout"
        isOpened={isOpened}
        title=""
        onClose={(val) => {
          setIsOpened(val);
        }}
      >
        <div className="box">
          <div
            className="invite-container"
            onClick={() => {
              const userInfo = JSON.parse(getStore("userInfo") as string);
              const inviteLink = `https://web.mingque.com/brandlogin/${router?.params?.spaceId}?referenceId=${userInfo?.user?.id}`;
              // const inviteLink = `https://test.mingque.com/brandlogin/${router?.params?.spaceId}?referenceId=${userInfo?.user?.id}`;

              Taro.setClipboardData({
                data: inviteLink,
                success: function (res) {
                  setShowToast(true);
                  setTimeout(() => {
                    setShowToast(false);
                  }, 1500);
                  setIsOpened(false);
                },
              });
            }}
          >
            <img src={inviteIcon} alt="" />
            <p className="invite-text">复制邀请链接</p>
          </div>
        </div>
        <div
          className="cancel"
          onClick={() => {
            setIsOpened(false);
          }}
        >
          取消
        </div>
      </AtFloatLayout>
    </View>
  );
};
